@import url('https://fonts.googleapis.com/css?family=Advent+Pro|Dancing+Script&display=swap');

html {
  scroll-behavior: smooth;
  background-color: #ffffff ;
}
body {
  font-family: 'Advent Pro', sans-serif;
  padding: 0;
  margin: 0;
}
ul {
  margin: 0;
  padding: 0;
}
li {
  list-style-type: none;
}
h2 {
  text-transform: uppercase;
  text-align: center;
  padding-top: 30px;
  font-size: 2em;
}
a {
  text-decoration: none;
  color: black;
}
/* ******************* NAVBAR ******************* */
nav {
  overflow: hidden;
  background-color: #FFFAE1;
  position: fixed;
  width: 100%;
  opacity: 0.9;
}
header li {
  float: right;
  font-size: 1.2em;
}
header li a {
  text-decoration: none;
  display: block;
  text-align: center;
  padding: 18px 16px;
}
.active {
  background-color: #01DF74;
}
#logo {
  font-family: 'Dancing Script', cursive;
  font-weight: bold;
  float: left;
}
/* **************** IMAGE PRINCIPALE ************* */
#imagePrincipale {
  padding-top: 60px;
  background: url(media/image-principale.JPG) no-repeat fixed 50% 50%;
  background-size: cover;
  height: 799px;
}
h1 {
  font-family: 'Dancing Script', cursive;
  text-align: center;
  color: antiquewhite;
  font-size: 6em;
  margin-top: 100px;
  text-shadow: 1px 3px 2px black;
}
#premierTrait {
  height: 1px;
  width: 25%;
  margin: -3px auto;
  background-color: #FFFAE1;
  box-shadow: 1px 3px 2px black;
}
h3 {
  text-align: center;
  color:antiquewhite;
  font-size: 3em;
  text-shadow: 1px 3px 2px black;
}
/* *************** PRESENTATION ********************** */
#presentation {
  background-color: #FFFAE1;
  padding: 10px 0px 100px 0;
}
#texteIntro {
  padding: 0px 20%;
}
#texteIntro p{
  font-size: 1.5em;

}
#prestations {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 30px 10%;  
}
.imagesPrestations h4 {
  font-family: 'Dancing Script', cursive;
  text-align: center;
  font-size: 1.8em;
  margin: 15px;
  font-weight: 300;
}
.imagesPrestations img {
  border-radius: 10px;
  box-shadow: 5px 5px 3px 1px rgba(0,0,0,0.7);
}
.imagesPrestations img:hover {
  opacity: 0.5;
  transform: scale(1.05);
  transition: 0.6s ease-in-out;
}
/* **************** MON OBJECTIF ********************** */
#objectif {
  height: 800px;
  background-color: #f1f2f6;
  padding: 1px 2%;
}
#objectif h2 {
  padding-top: 60px;
}

#objectif h3 {
  padding-top: 0px;
  font-size: 1.6em;
  color: #000000;
  text-shadow :none;
}

#Web {
  background: url(media/Web.JPG);
}

#Développeur {
  background: url(media/Développeur.JPG);
}

#objectif li {
  margin: 65px 100px 0 100px;
  height: 226px;
  width: 55%;
  max-width: 550px;
  float: left;
  box-shadow: 6px 6px 28px -1px rgba(0,0,0,0.75);
}
#objectif p {
  height: 45px;
  width: 235px;
  background-color: #01DF74;
  float:right;
  margin: 50px -180px 0 0;
  font-size: 1.5em;
  text-align: center;
  padding-top: 15px;
  box-shadow: 4px 4px 0 1px rgba(90,161,43,1);
}
#objectif #fibre, #objectif #Réseaux  {
  float: right;
}
#fibre p, #Réseaux p {
  float: left;
  background-color: cyan;
  margin-left: -180px;
  box-shadow: -4px 4px 0 1px rgba(15,154,156,1);
}
@media screen and (max-width:1000px){
  #objectif{
    height: 950px;
  }
}